/**
 * 图片预览
 * @author yangjian
 */
(function($) {

	$.fn.jpreview = function() {

		$(this).on("click", function() {

			var src = $(this).attr('data-src');
			if ( !src ) {
				alert("图片地址不存在，无法预览.");
				return;
			}
			var timer = 500;
			var $lock = $('<div style="position: absolute; background: #000000; opacity: .6; z-index: 666; display: none;"></div>');
			var $imgBox = $('<div style="display: none; position: absolute; z-index: 999; "></div>');
			var $img = $('<img src="" style="max-width: '+($(window).width() - 30)+'px;" />');
			var $closeBtn = $('<span style="position: absolute; font-size: 30px; border-radius: 40px; font-weight: bold;' +
				'height: 40px; width: 40px; line-height: 35px; z-index: 999; background: #ffffff; text-align: center; cursor: pointer;">x</span>');
			$closeBtn.css({
				top : -20,
				right : -20
			});
			$closeBtn.on('click', function() {
				$lock.fadeOut(timer, function() {$lock.remove()});
				$imgBox.fadeOut(timer, function() {$imgBox.remove()});
			});

			$lock.css({
				left : 0,
				top : 0,
				width : $(document).width(),
				height : $(document).height()
			});
			$lock.on('click', function() {
				$lock.fadeOut(timer, function() {$lock.remove()});
				$imgBox.fadeOut(timer, function() {$imgBox.remove()});
			});

			var _scrollTop = window.document.body.scrollTop || window.document.documentElement.scrollTop;
			$imgBox.css({
				top : $(window).height() / 2 + _scrollTop,
				left : $(window).width() / 2,
			});
			$img.attr('src', src);
			$img.on("load", function() {
				$imgBox.css({
					top : ($(window).height() - $imgBox.height()) / 2 + _scrollTop,
					left : ($(window).width() - $imgBox.width()) / 2,
				}).fadeIn(timer);
			});
			$imgBox.append($img);
			$imgBox.append($closeBtn);

			$('body').append($lock.fadeIn(timer));
			$('body').append($imgBox);

		});
	}

})(jQuery);
